<template>
    <div>
        <div class="conpdsmall aligncenter" v-if="tableLoading">
            <van-loading size="24px" vertical>加载中...</van-loading>
        </div>
        <template v-else>
            <van-cell-group v-if="dataSource.length > 0">
                <van-cell v-for="(data,hdindex) in dataSource" :key="hdindex" @click="detail(data)">
                    <zwcard :columns="columns" :item="data"></zwcard>
                </van-cell>
            </van-cell-group>
            <template v-else>
                <div class="loadbox">暂无数据</div>
            </template>
			
			<div class="conpdsmall" v-if="dataSource.length > 0">
				<uni-pagination 
					show-icon="true" 
					:total="pagination.total" 
					:current="pagination.current"
					:pageSize="pagination.PageSize"
					@change="paginationchange"
					>
				</uni-pagination>
				<div style="height: 8px;"></div>
				<van-cell-group>
					<van-field :value="pageval" maxlength="6" type="number" center clearable label="页数" placeholder="请输入页数"
					:border="false" use-button-slot @change="inputpageval"
					>
					    <van-button slot="button" type="info" size="small" style="white-space: nowrap" @click="pagejump">跳转</van-button>
					</van-field>
				</van-cell-group>
			</div>
        </template>
    </div>
</template>

<script>
    import zwcard from '@/components/card/zwcard';
	import uniPagination from '@/components/uni-pagination/uni-pagination.vue'
    export default {
        props:{
            select:{ type: Boolean, default: false },
            tableLoading:{ type: Boolean, default: false },
            pagination: { type: Object, default: () => {}, },
            columns: { type: Array, default: () => [], },
            dataSource: { type: Array, default: () => [], },
        },
        name: "zwtable",
        data () {
            return {
                pageval: '',
            }
        },
        computed:{
        },
        created () {
        },
        methods: {
			inputpageval(event){
				this.pageval = event.mp.detail
			},
            pagejump(){
                var that = this
                const value = Number(that.pageval);
                const reg = /^[1-9]\d*$/;
                if (!reg.test(value)) {that.pageval = '';return}
                var pagetotal = Math.ceil(that.pagination.total / that.pagination.PageSize)
                if (value > pagetotal) that.pageval = pagetotal
				that.$emit("pagchange",Number(that.pageval))
                that.pageval = ''
            },
            paginationchange(e){
                // this.pagination.onChange(current)
				this.$emit("pagchange",e.current)
            },
            detail(record){
                if (this.select) {
                    this.$emit("selectzw",record)
                    return
                }
                this.$emit("showdetail",record)
            }
        },
        components:{
            zwcard, uniPagination
        },
    };
</script>

<style scoped>
</style>